<template>
	<view class="share">
		<view class="share-tit"><input type="text" placeholder="请输入店铺分享标语" v-model="form.share_txt" /></view>
		<view class="share-img">
			<view class="share-img-upload" v-if="!form.share_images" @click="choseImg">
				<view class="center">
					<image src="https://master.shengejiaju.cn/web/static/icons/ico_add_pic02@2x.png"></image>
					<view>请添加店铺分享图片</view>
				</view>
			</view>
			<view class="share-img-isupload" v-else>
				<image mode="widthFix" :src="form.share_images"></image>
				<view @click="choseImg">更换店铺分享图片</view>
			</view>
		</view>
		<view class="btns"><button type="primary" @click="submit">保存</button></view>
	</view>
</template>

<script>
	const md5 = require('../../static/utils/md5')
	import host from '@/api/config.js'
	export default {
		data() {
			return {
				uploadParameter: {},
				form: {
					store_id: JSON.parse(uni.getStorageSync('userInfo')).store_id,
					share_txt: '',
					share_images: ''
				},
			};
		},
		onLoad() {
			this.init()
		},
		onShow() {
			
		},
		methods: {
			// 参数排序
			objKeySort(obj) {
				var newkey = Object.keys(obj).sort();
				var newObj = {};
				for (var i = 0; i < newkey.length; i++) {
						newObj[newkey[i]] = obj[newkey[i]];
				}
				return newObj;
			},
			init(){
				let data = {}
				// #ifdef H5
				let ua = navigator.userAgent.toLowerCase()
				if (ua.match(/MicroMessenger/i) == "micromessenger") {
					data.port = 'wechat'
				}else{
					data.port = 'h5'
				}
				// #endif
				
				// #ifdef APP-PLUS
				switch(uni.getSystemInfoSync().platform){
					case 'android':
						data.port = 'android'
					  break;
					case 'ios':
						data.port = 'ios'
					  break;
				}
				// #endif
				
				data.key = JSON.parse(uni.getStorageSync('userInfo')).token
				
				data.timestamp = Math.round(new Date() * 1000)
				// 获取签名开始
				let obj = 'jjds2020+'
				let newObj = this.objKeySort(data)
				for (let i in newObj){
					obj += i + '=' + newObj[i] +'&'
				}
				obj = obj.substring(0, obj.length - 1)
				obj += '+jjds2020'
				obj = md5.hexMD5(obj)
				obj = obj.toUpperCase()
				// 获取签名结束
				data.sign = obj
				this.uploadParameter = data
				this.$api.StoreDetail({paramter: 1,store_id: this.form.store_id}).then(res => {
					if(res.datas[0].store_data.share_images){
						if(res.datas[0].store_data){
							this.form.share_images = res.datas[0].store_data.share_images
							this.form.share_txt = res.datas[0].store_data.share_txt
						}
					}
				})
			},
			choseImg(){
				let _this = this
				uni.chooseImage({
					count: 1,
					sourceType: ['album','camera'],
					success(res) {
						let imgs = []
						res.tempFiles.forEach(item => {
							imgs.push({
								uri: item.path
							})
						})
						uni.uploadFile({
							url: `${host}/api/Upimg/UpImg`,
							filePath: imgs[0].uri,
							name: 'file',
							formData: {
								port: _this.uploadParameter.port,
								key: _this.uploadParameter.key,
								timestamp: _this.uploadParameter.timestamp,
								sign: _this.uploadParameter.sign
							},
							success: (uploadFileRes) => {
								_this.form.share_images = JSON.parse(uploadFileRes.data).datas[0]
							}
						});
					}
				})
			},
			submit(){
				if(!this.form.share_txt){
					uni.showToast({
						icon: 'none',
						title: '请输入分享标语',
						duration: 1500
					})
					return false
				}else if(!this.form.share_images){
					uni.showToast({
						icon: 'none',
						title: '请上传分享图片',
						duration: 1500
					})
					return false
				}
				this.$api.StoreUpData(this.form).then(res => {
					uni.showToast({
						icon: 'none',
						title: '保存成功',
						duration: 1500
					})
					setTimeout(() => {
						uni.navigateBack()
					},1500)
				})
			}
		}
	}
</script>

<style lang="scss">
	.share{
		padding-top: 20rpx;
		.share-tit{
			background-color: #FFF;
			input{
				padding: 30rpx 20rpx;
				font-size: 32rpx;
			}
		}
		.share-img{
			background-color: #FFF;
			padding: 85rpx 120rpx;
			margin-top: 20rpx;
			.share-img-upload{
				text-align: center;
				height: 330rpx;
				background: rgba(32,115,245,0.1);
				border: 2rpx dashed rgba(32,115,245,1);
				border-radius: 10rpx;
				position: relative;
				.center{
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%,-50%);
					font-size: 30rpx;
					color: #666;
					white-space: nowrap;
					image{
						width: 59rpx;
						height: 44rpx;
						vertical-align: top;
						margin-bottom: 10rpx;
					}
				}
			}
			.share-img-isupload{
				text-align: center;
				image{
					width: 100%;
					vertical-align: top;
					background-color: #EEE;
					border-radius: 10rpx;
					margin-bottom: 20rpx;
				}
				view{
					background-color: #2073F5;
					color: #FFF;
					padding: 20rpx 40rpx;
					border-radius: 40rpx;
					display: inline-block;
					font-size: 28rpx;
				}
			}
		}
		.btns{
			padding: 50rpx 75rpx;
			button{
				background-color: #2073F5;
				border-radius: 100rpx;
				height: 100rpx;
				line-height: 100rpx;
			}
		}
	}
</style>
